<template>
	<view>
		<div class="top">
			<div class="iconbg">
				<i class="iconfont icontubiaozhizuomoban-2"></i>
			</div>
			<div class="cent" v-if="courseInfo">
				<h2>{{courseInfo.pname}}</h2>
				<div><span>{{courseInfo.nowfee}}</span><u>{{courseInfo.oldfee}}</u></div>
				<div><i class="iconfont icontubiaozhizuomoban-6"></i>上门支付</div>
			</div>
		</div>
		
		<div class="formSubmit">
			<view class="uni-form-item uni-column">
				<view class="title"><em>*</em>姓名</view>
				<input class="uni-input" v-model="formData.name" name="input" placeholder="请输入姓名" />
			</view>
			<view class="uni-form-item uni-column">
				<view class="title"><em>*</em>手机</view>
				<input class="uni-input" name="input" v-model="formData.phone" placeholder="请输入手机号码" />
			</view>
			<view class="uni-form-item uni-column">
				<view class="title">邮箱</view>
				<input class="uni-input" name="input" v-model="formData.email" placeholder="请输入邮箱地址" />
			</view>
			<view class="uni-form-item uni-column">
				<view class="title"><em>*</em>公司名称</view>
				<input class="uni-input" name="input" v-model="formData.company" placeholder="请输入公司名称" />
			</view>
			<view class="uni-form-item uni-column">
				<view class="title"><em>*</em>职位</view>
				<input class="uni-input" name="input" v-model="formData.position" placeholder="请输入职位" />
			</view>
			<view class="uni-form-item uni-column">
				<view class="title">如何了解到第一胜任力</view>
				<input class="uni-input" name="input" v-model="formData.how" placeholder="请输入获取渠道" />
			</view>
			<view class="uni-form-item uni-column">
				<view class="title">买家留言</view>
				<input class="uni-input" name="input" v-model="formData.mess" placeholder="请输入买家留言" />
			</view>
			<button form-type="submit" type="warn" @tap="formSubmit" class="submit">提交订单</button>
		</div>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				formData:{
					mid:uni.getStorageSync('userInfo').id
				},
				courseInfo:''
			};
		},
		onLoad (option) {
		    this.formData.courseid = option.courseid
			this.courseInfo=option
		},
		methods:{
			formSubmit(e){
				if(!this.formData.name){
					this.toast('请输入姓名')
					return
				}
				if(!this.formData.phone){
					this.toast('请输入手机号码')
					return
				}
				if(!this.formData.email){
					this.toast('请输入邮箱地址')
					return
				}
				if(!this.formData.company){
					this.toast('请输入公司名称')
					return
				}
				if(!this.formData.position){
					this.toast('请输入职位')
					return
				}

				this.$api('/Api/tcc/submitInfo.html', this.formData).then(res => {
					uni.showToast({
					    title: '操作成功',
					    duration: 2000,
						icon:'none'
					});
					setTimeout(()=>{
						uni.navigateBack()
					},2000)
				})
			},
			toast(e){
				uni.showToast({
				    title: e,
				    duration: 2000,
					icon:'none'
				});
			}
		}
	}
</script>

<style lang="less" scoped>
.top{
	padding: 35rpx;
	.iconbg{vertical-align: top; background: #005AAE;width:180rpx;height:124rpx;text-align: center;line-height: 124rpx;margin-right: 40rpx;display: inline-block;
		.iconfont{font-size: 100rpx;color: #fff;}
	}
	
	.cent{
		display: inline-block;
		h2{font-size: 24rpx;color: #666;font-weight: bold;}
		div{
			line-height: 40rpx;
			span{display: inline-block;color: #D30000;font-size: 24rpx;font-weight: bold;}
			u{display: inline-block;font-size: 18rpx;color: #666; text-decoration:line-through;margin-left: 30rpx;}
			.iconfont{color: #005AAE;display: inline-block;}
		}
	}
}

.formSubmit{
	box-sizing: border-box;
	padding: 40rpx 60rpx 20rpx;
	.uni-form-item{
		border-bottom: 1rpx solid #ddd;
		padding: 35rpx 0 0;
		.title{
			color: #000;font-size: 18rpx;
			em{color: #005BAC;display: inline-block;}
		}
		.uni-input{height: 60rpx;line-height: 60rpx;}
	}
	
	.submit{
		width:529rpx;
		height:70rpx;
		line-height: 70rpx;
		border-radius: 70rpx;
		margin-top: 44rpx;
		font-size: 24rpx;
	}
}
</style>
